<table class="table editable-table">
    <thead>
    <tr>
        <th class="opts"></th>
        <th class="opts">Available</th>
        <th>Key</th>
        <th>Operator</th>
        <th>Value</th>
    </tr>
    </thead>
    <tbody>
    <tr *ngFor="let kv of params; let i=index; let last=last;">
        <td class="opts">
            <i *ngIf="!last" class="material-icons" (click)="deleteItem(i)">delete_forever</i>
        </td>
        <td class="opts align-center">
            <input type="checkbox" name="available" value="true" [(ngModel)]="kv.available" [checked]="kv.available">
        </td>
        <td>
            <input class="input" [(ngModel)]="kv.key" (change)="onKeyChange(kv)" (focusout)="onKeyChange(kv)">
        </td>
        <td class="align-center">
            <select [(ngModel)]="kv.operator">
                <option value="==">==</option>
                <option value=">">&gt;</option>
                <option value=">=">&gt;=</option>
                <option value="<">&lt;</option>
                <option value="<=">&lt;=</option>
                <option value="!=">!=</option>
                <option value="contains">contains</option>
                <option value="startWith">startWith</option>
            </select>
        </td>
        <td>
            <input class="input" [(ngModel)]="kv.value">
        </td>
    </tr>
    </tbody>
</table>
